<template>
	<view>
		<u-sticky offsetTop="97rpx">
			<view><tab :tab-list="productCate" @tabAll="tabAll" @contTabChange="contTabChange"></tab></view>
		</u-sticky>
		<view class="" v-if="list.length == 0">
			<view class="p-2 mt-3"><u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty></view>
		</view>
		<view v-else class="container">
			<view class="mt-3">
				<product-list v-if="list.length >= 1" :list="list" :btn-show="true" :edit-btn="true" @proDel="proDel" class="flex flex-wrap justify-between"></product-list>
			</view>
			<u-loadmore :status="status" color="#E5E5E5" lineColor="#E5E5E5" dashed line />
		</view>
	</view>
</template>

<script>
import { productCategory, getProductList } from '@/api/home/nav/product_data.js';
import { productDel } from '@/api/my/publish.js';
import tab from '@/components/tab/index.vue';
import productList from '@/components/product_list/product_list.vue';
export default {
	components: { tab, productList },
	data() {
		return {
			productCate: [], //产品分类
			list: [],
			status: 'loadmore',
			page: 1, //页数
			suo: true,
			cateId: '', //分类id
			delList: {},
			cityIp: '' //用户当前ip
		};
	},
	created() {
		this.getInfo();
	},
	mounted() {
		let that = this;
		uni.$on('onReachBottom1', data => {
			// console.log('上拉加载');
			if (this.suo) {
				//定义个小锁，当没有数据时锁住suo
				this.status = 'loading';
				this.page = ++this.page;
				setTimeout(() => {
					this.getProduct(this.cateId);
				}, 1000);
			}
		});
	},
	methods: {
		reset() {
			this.list = [];
			this.page = 1;
		},
		// tab-全部
		tabAll() {
			this.cateId = '';
			this.reset();
			this.getProduct('');
			this.$emit('productSort', '');
		},
		contTabChange(e) {
			// console.log(val);
			this.cateId = e.val.id;
			this.$emit('productSort', e.val.id);
			this.reset();
			this.getProduct(e.val.id);
		},
		getInfo() {
			// 产品分类
			productCategory()
				.then(res => {
					if (res.code == 0) {
						this.productCate = res.data;
						this.getProduct('');
					} else {
						uni.$u.toast(res.msg);
					}
				})
				.catch(err => {
					console.log('获取产品分类失败', err);
				});
		},
		// 产品列表
		getProduct(val) {
			let res = {
				page: this.page,
				mid: val,
				token: uni.getStorageSync('userInfo').token || '',
				uid: uni.getStorageSync('userInfo').userId || ''
			};
			getProductList(res).then(res => {
				// console.log('产品列表', res.data.list);
				this.list.push(...res.data.list);
				if (res.data.list.length == 0) {
					this.status = 'nomore';
					this.suo = false;
				} else if (res.data.list.length < 10) {
					this.status = 'nomore';
					this.suo = false;
				} else {
					this.status = 'loadmore';
					this.suo = true;
				}
			});
		},
		proDel(val) {
			this.delList = {
				product_ids: val.product_ids,
				textProductIds: val.textProductIds
			};
			let num = val.product_ids.length + val.textProductIds.length;
			this.$emit('delChange', num);
		},
		// 删除
		checkDel() {
			// console.log('参数', this.delList.product_ids);
			// console.log('图文', this.delList.textProductIds);
			// this.getIp();
			let msg = {
				token: uni.getStorageSync('userInfo').token || '',
				product_ids: this.delList.product_ids,
				text_product_ids: this.delList.textProductIds
				// returnCitySN: this.cityIp
			};
			productDel(msg)
				.then(res => {
					// console.log(res);
					if (res.code == 0) {
						this.reset();
						this.getProduct(this.cateId);
						this.$emit('delAfter');
					}
					uni.$u.toast(res.msg);
				})
				.catch(err => {
					console.log('删除失败', err);
				});
		},
		// 获取当前用户ip地址
		getIp() {
			uni.request({
				url: 'http://pv.sohu.com/cityjson?ie=utf-8',
				method: 'POST',
				success: res => {
					this.cityIp = res.data.split('=')[1];
					// const reg = /\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}/;
					// let ip = reg.exec(res.data);
					// console.log(ip[0]);
				},
				catch: err => {
					console.log('获取ip地址失败');
				}
			});
		}
	}
};
</script>

<style></style>
